var AppRouter = Backbone.Router.extend({
    /*
     * initialize类似于构造函数, 可传入初始化数据
     * 只能使用initialize这个函数名, 否则无法在初始化时执行
     */
    initialize: function(){},

    routes: {
        '': 'dashboard',
        'dashboard': 'dashboard',
        'minion': 'minion',
        'server': 'server',
        // BK的多级路由实现方式
        'process/:minionId(/:procType)(/:idx)': 'procList',
        'rmcmd':'rmcmd',
        'job': 'job',
        'job/:jid': 'jobDetail',
        'sysproc': 'sysproc'
    },

    dashboard: function(){
        if(app.modules.Dashboard){
            app.modules.curr = new app.modules.Dashboard();
        }else{
            // 用$('body')偷个懒, 不然第一个函数必须为自执行, 得写var a = function(){}();
            $('body').promise()
            .then(function(){
                var def = $.Deferred();
                $('#tpl-dashboard').load('/dashboard', function(){
                    def.resolve();
                }); 
                return def.promise();
            })
            .then(function(){
                return $.getScript('/static/js/dashboard.js'); 
            })  
            .then(function(){
                app.modules.curr = new app.modules.Dashboard();
            }); 
        }
    },
    procList: function(minionId, procType, idx){
        app.xbox = {
            minionId: minionId,
            procType: procType,
            idx: idx
        };
        if(app.modules.Process){
            app.modules.curr = new app.modules.Process();
        }else{
            // 用$('body')偷个懒, 不然第一个函数必须为自执行, 得写var a = function(){}();
            function _load1(){
                var def = $.Deferred();
                $('#tpl-process').load('/process', function(){
                    def.resolve();
                }); 
                return def.promise();
            }
            function _load2(){
                var def = $.Deferred();
                $('#tpl-register-form').load('/register-form', function(){
                    def.resolve();
                }); 
                return def.promise();
            }
            function _load3(){
                return $.getScript('/static/js/process.js'); 
            }
            $('body').promise()

            // $.when()的参数是要加括号的...
            $.when(_load1(), _load2())
            .then(_load3)
            .then(function(){
                app.modules.curr = new app.modules.Process();
            }); 
        }
    },
    rmcmd: function(){
        if(app.modules.Rmcmd){
            app.modules.curr = new app.modules.Rmcmd();
        }else{
            // 用$('body')偷个懒, 不然第一个函数必须为自执行, 得写var a = function(){}();
            $('body').promise()
            .then(function(){
                var def = $.Deferred();
                $('#tpl-rmcmd').load('/rmcmd', function(){
                    def.resolve();
                }); 
                return def.promise();
            })
            .then(function(){
                return $.getScript('/static/js/rmcmd.js'); 
            })  
            .then(function(){
                app.modules.curr = new app.modules.Rmcmd();
            }); 
        }
    },
    minion: function(){
        if(app.modules.Minion){
            app.modules.curr = new app.modules.Minion();
        }else{
            // 用$('body')偷个懒, 不然第一个函数必须为自执行, 得写var a = function(){}();
            $('body').promise()
            .then(function(){
                var def = $.Deferred();
                $('#tpl-minion').load('/minion', function(){
                    def.resolve();
                });
                return def.promise();
            })
            .then(function(){
                return $.getScript('/static/js/minion.js');
            })  
            .then(function(){
                app.modules.curr = new app.modules.Minion();
            });
        }
    },
    server: function(){
        if(app.modules.Server){
            app.modules.curr = new app.modules.Server();
        }else{
            // 用$('body')偷个懒, 不然第一个函数必须为自执行, 得写var a = function(){}();
            $('body').promise()
            .then(function(){
                var def = $.Deferred();
                $('#tpl-server').load('/server', function(){
                    def.resolve();
                });
                return def.promise();
            })
            .then(function(){
                return $.getScript('/static/js/server.js');
            })  
            .then(function(){
                app.modules.curr = new app.modules.Server();
            });
        }
    },
    job: function(){
        if(app.modules.Job){
            app.modules.curr = new app.modules.Job();
        }else{
            // 用$('body')偷个懒, 不然第一个函数必须为自执行, 得写var a = function(){}();
            $('body').promise()
            .then(function(){
                var def = $.Deferred();
                $('#tpl-job').load('/job', function(){
                    def.resolve();
                }); 
                return def.promise();
            })
            .then(function(){
                return $.getScript('/static/js/job.js'); 
            })
            .then(function(){
                app.modules.curr = new app.modules.Job();
            });
        }
    },
    jobDetail: function(jid){
        app.xbox = {
            jid: jid,
        };
        if(app.modules.JobDetail){
            app.modules.curr = new app.modules.JobDetail();
        }else{
            // 用$('body')偷个懒, 不然第一个函数必须为自执行, 得写var a = function(){}();
            $('body').promise()
            .then(function(){
                var def = $.Deferred();
                $('#tpl-job-detail').load('/job-detail', function(){
                    def.resolve();
                });
                return def.promise();
            })
            .then(function(){
                return $.getScript('/static/js/job-detail.js'); 
            })
            .then(function(){
                app.modules.curr = new app.modules.JobDetail();
            });
        }
    },
    sysproc: function(){
        if(app.modules.SysProc){
            app.modules.curr = new app.modules.SysProc();
        }else{
            // 用$('body')偷个懒, 不然第一个函数必须为自执行, 得写var a = function(){}();
            $('body').promise()
            .then(function(){
                var def = $.Deferred();
                $('#tpl-sysproc').load('/sysproc', function(){
                    def.resolve();
                }); 
                return def.promise();
            })
            .then(function(){
                return $.getScript('/static/js/sysproc.js'); 
            })
            .then(function(){
                app.modules.curr = new app.modules.SysProc();
            });
        }
    },
});

var BreadcrumbView = Backbone.View.extend({
    // el与initialize一样是bk的关键字, 不能重命名为其它
    el: '#breadcrumbs',
    initialize: function() {
        this.render();
    },
    render: function() {
        var template = _.template($("#tpl-breadcrumbs").html());
        this.$el.html(template(this.model.toJSON()));
    }
});

var SidenavView = Backbone.View.extend({
    /*
        nav侧边栏的a标签点击不会导致整个页面的重写
    */

    // el与initialize一样是bk的关键字, 不能重命名为其它
    el: '#sidebar',
    events: {
        // 事件选择器
        'click a': 'show'
    },
    initialize: function(opts) {
        this.eventBus = opts.eventBus;        
    },
    show: function(e){}
});

var TableView = Backbone.View.extend({
    // el与initialize一样是bk的关键字, 不能重命名为其它
    el: '.bootstrap-table',
    events: {},
    baseCols: [        
        {field: 'selector', checkbox: true},
        {
            field: 'number', 
            title: '序号', 
            align: 'center', 
            formatter: function (value, row, index) {
                return index + 1;
            }
        }
    ],
    baseOpts: {
        classes: 'table table-hover table-no-bordered',
        sidePagination: 'server',
        idField: 'id',
        uniqueId: 'id',
        search: true,
        pagination: true,
        paginationVAlign: 'bottom',
        paginationHAlign: 'left',
        paginationDetailHAlign: 'right',
        pageList: [20, 50, 100, 500],
        toolbarAlign: 'left',
        toolbar: '.toolbar',
        striped: false,
        showToggle: true,
        showColumns: true,
        showExport: true,
    },
    opts: {},
    columns: [],
    prepare: function(){
        // $.merge会修改bashCols的值, 而且只接受两个参数(不能用[]空列表), 需要创建一个副本
        this.columns = $.merge(this.baseCols.concat(), this.columns);

        this.opts.columns = this.columns;
        this.opts = $.extend({}, this.baseOpts, this.opts);
    },
    initialize: function(options) {
        this.eventBus = options.eventBus;
        this.columns = options.columns;
        this.opts = options.opts;
        this.el = options.el ? options.el : this.el;
        this.prepare();
        this.render();
    },
    render: function(){
        this.$el.bootstrapTable(this.opts);
    }
});

var Breadcurmb = Backbone.Model.extend({
    defaults: {prefix: [], curr: '仪表盘'}
});

var AppView = Backbone.View.extend({
    initialize: function() {
        // 用xbox变量向模块传递路由参数, 不同模块间不要相互影响
        this.xbox = {};
        this.modules = {};
        this.routes = {};
        // 事件总线
        this.eventBus = _.extend({}, Backbone.Events);
        this.sidenavView = new SidenavView({
            eventBus: this.eventBus
        });
    },
    getCurr: function(){
        // 返回当前模块的实例引用
        return this.modules.curr;
    }
});

// 入口
window.app = new AppView({});

window.appRouter = new AppRouter();
Backbone.history.start();
